<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
    
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
	String path = request.getContextPath();
	String pathfile = path+"/view";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	
	<title>Lexy - ${title} </title>
	
   	<link href="<%=pathfile %>/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
   	<link href="<%=pathfile %>/plugins/blueimp/css/blueimp-gallery.min.css" rel="stylesheet">
    <link href="<%=pathfile %>/bac/css/font-awesome.min.css" rel="stylesheet">
    <link href="<%=pathfile %>/bac/css/animate.css" rel="stylesheet">
    <link href="<%=pathfile %>/bac/css/style.css" rel="stylesheet">
    
    <style type="text/css">
    	body{font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;}
    	/* ,"STXinwei" */
    	.folder-list li a {
		    color: #666666;
		    display: block;
		    padding: 10px 0;
		    font-size: 15px;
		    line-height:30px;
		}
		.layout-top{height:70px;line-height: 35px; }
		.blog_tit_img{height:auto;width:100%;max-height:200px; padding:0px 2px ; overflow:hidden ;border-radius: 5px;}
    	.blog_tit_img img{width:100%;}
    	.margin-top{margin-top: 5px ;     line-height: 2;}
    	#blog-content img{max-width:100%}
    </style>
    
    
</head>
<body class=" gray-bg top-navigation">
	<span name="goto-top"></span>
	<div id="wrapper"   >
		<div id="page-wrapper" class="gray-bg">
			<div class="row border-bottom white-bg navbar-fixed-top">
				<nav class="navbar navbar-static-top " role="navigation">
					<div class="navbar-header" style="width:100%;height:70px">
					    <!-- <button style="height:70px" aria-controls="navbar" aria-expanded="false" data-target="#navbar" data-toggle="collapse" class="navbar-toggle collapsed" type="button">
					        <i class="fa fa-reorder"></i>
					    </button> -->
					    <!-- <ul class="nav navbar-top-links navbar-right layout-top"> -->
                        <ul class="nav navbar-top-links navbar-right">
                        	<c:if test="${sessionScope.user==null }">
								<li>
									<a id="sgin-in-model" class="layout-top"  >
										<span ><i class="fa fa-sign-in"></i> 登录</span>
									</a>
								</li>
                        	</c:if>
                        	<c:if test="${sessionScope.user!=null }">
                       			<li class="dropdown">
		                            <a class="dropdown-toggle count-info layout-top" data-toggle="dropdown" href="#">
		                                <i class="fa fa-user"></i> ${sessionScope.user.user_name}
		                            </a>
                        			<ul class="dropdown-menu dropdown-alerts dropdown-list">
		                                <li>
		                                    <a href="-Hplus-v.4.1.0/mailbox.html">
		                                        <div>
		                                            <i class="fa fa-envelope fa-fw"></i> 设置
		                                        </div>
		                                    </a>
		                                </li>
	                                	<li class="divider"></li>
		                                <li>
		                                    <a href="-Hplus-v.4.1.0/profile.html">
		                                        <div>
		                                            <i class="fa fa-qq fa-fw"></i> 个人信息
		                                        </div>
		                                    </a>
		                                </li>
	                                	<li class="divider"></li>
		                                <li>
		                                    <div class="text-center link-block">
		                                        <a class="J_menuItem" href="" data-index="89">
		                                            <strong>查看所有 </strong>
		                                            <i class="fa fa-angle-right"></i>
		                                        </a>
		                                    </div>
		                                </li>
	                            	</ul>
                       			</li>
	                       	 	<a id="sgin-out" class="layout-top"  >
		                            <span>
		                             <i class="fa fa-sign-out"></i> 退出
		                            </span>
		                        </a>
                        	</c:if>
	                        
	                        
		                 </ul>
		                 
   		                 <c:if test="${sessionScope.user!=null }">
			                 	<ul class="nav navbar-top-links navbar-left layout-top">
			                 		<li><span><img alt="image" class="img-circle" src="img/profile_small.jpg" /></span>
			                                <span class="clear">
			                               <span class="block m-t-xs"><strong class="font-bold">Beaut-zihan</strong></span>
			                                </span>
			                 		</li>
			                 	</ul>
                       	</c:if>
					</div>
				</nav>
			</div>
		</div>
	</div>
	<div id="wrapper wrapper-content animated fadeInUp" style="width:90%;margin:0 auto;margin-top: 80px;">
    	<div class="row" id="blog-content">
        	<div class="col-sm-3 "  style=" "  >
        		<div class="ibox">
        			<div class="ibox-title">
	        			<h5>分类</h5>
                    </div>
	        		<div class="ibox-content" style="padding:0px 0px 10px 10px">
	        			<!-- 
	        				分割线
	        			<div class="hr-line-dashed"></div>
	        			 -->
	                    <%-- <ul class="folder-list" id="blog_type_list" style="padding: 0">
	                    	<c:forEach items="${blogTypeList }" var="obj">
		                    	<li>
		                    		<a onclick="findBlogByTypeNo(1)">
		                    			<i class="fa fa-folder"></i> ${obj.type_name }
		                    			<!-- <span class="label label-warning pull-right">4</span> -->
		                    		</a>
	                  			</li>
	                    	</c:forEach>
	                    		
                        </ul> --%>
                        <div id="label-list">
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	<button class="btn btn-white btn-xs margin-top" type="button">速比涛</button>
                        	
                        </div>
                 	</div>
        		</div>
        	</div>
        	<div class="col-sm-8" style="display: hidden; ">
					<div class="ibox-content">
						<div style="margin:0 auto;">
							<div class="text-center article-title">
	                            <h1>${blog.blog_title }</h1>
	                        </div>
	                        <div id="blog-content">
								${blog.blog_content }
								<div id="blueimp-gallery" class="blueimp-gallery">
	                                <div class="slides"></div>
	                                <h3 class="title"></h3>
	                                <a class="prev">‹</a>
	                                <a class="next">›</a>
	                                <a class="close">×</a>
	                                <a class="play-pause"></a>
	                                <ol class="indicator"></ol>
	                            </div>
	                        </div>
						</div>
						<hr>
						<div class="row">
                            <div class="col-lg-12">

                                <h2>评论：</h2>
                                <div class="social-feed-box">
                                    <div class="social-avatar">
                                        <a href="" class="pull-left">
                                            <img alt="image" src="img/a1.jpg">
                                        </a>
                                        <div class="media-body">
                                            <a href="#">
                                                    逆光狂胜蔡舞娘
                                                </a>
                                            <small class="text-muted">17 小时前</small>
                                        </div>
                                    </div>
                                    <div class="social-body">
                                        <p>
                                            好东西，我朝淘宝准备跟进，1折开卖
                                        </p>
                                    </div>
                                </div>
                                <div class="social-feed-box">
                                    <div class="social-avatar">
                                        <a href="" class="pull-left">
                                            <img alt="image" src="img/a2.jpg">
                                        </a>
                                        <div class="media-body">
                                            <a href="#">
                                                    避雷范儿
                                                </a>
                                            <small class="text-muted"> 16 小时前</small>
                                        </div>
                                    </div>
                                    <div class="social-body">
                                        <p>
                                            第一个真的好美 就是噪音太大了 挺唯美的意境瞬间变成工厂了
                                        </p>
                                    </div>
                                </div>
                                <div class="social-feed-box">
                                    <div class="social-avatar">
                                        <a href="" class="pull-left">
                                            <img alt="image" src="img/a3.jpg">
                                        </a>
                                        <div class="media-body">
                                            <a href="#">
                                                    kamppi
                                                </a>
                                            <small class="text-muted"> 6 小时前</small>
                                        </div>
                                    </div>
                                    <div class="social-body">
                                        <p>
                                            好美的装置艺术，第二个让我想起了海中缓缓游动的鲸鱼。
                                        </p>
                                    </div>
                                </div>
                                <div class="social-feed-box">
                                    <div class="social-avatar">
                                        <a href="" class="pull-left">
                                            <img alt="image" src="img/a5.jpg">
                                        </a>
                                        <div class="media-body">
                                            <a href="#">
                                                    kamppi
                                                </a>
                                            <small class="text-muted">6 小时前</small>
                                        </div>
                                    </div>
                                    <div class="social-body">
                                        <p>
                                            “Flylight 的灯管并不固定，由一套软件控制：每一个灯管都根据与其它灯管的互动进行移动，就像一群真正的鸟群一样。” 好像介绍的描述不对，灯管是固定的，控制的只是点亮和熄灭的时间，模拟成一团亮点移动
                                        </p>
                                    </div>
                                </div>
                                <div class="social-feed-box">
                                    <div class="social-avatar">
                                        <a href="" class="pull-left">
                                            <img alt="image" src="img/a5.jpg">
                                        </a>
                                        <div class="media-body">
                                            <a href="#">
                                                    kamppi
                                                </a>
                                            <small class="text-muted">6 小时前</small>
                                        </div>
                                    </div>
                                    <div class="social-body">
                                        <p>
                                            “Flylight 的灯管并不固定，由一套软件控制：每一个灯管都根据与其它灯管的互动进行移动，就像一群真正的鸟群一样。” 好像介绍的描述不对，灯管是固定的，控制的只是点亮和熄灭的时间，模拟成一团亮点移动
                                        </p>
                                    </div>
                                </div>
                                <div class="social-feed-box">
                                    <div class="social-avatar">
                                        <a href="" class="pull-left">
                                            <img alt="image" src="img/a5.jpg">
                                        </a>
                                        <div class="media-body">
                                            <a href="#">
                                                    kamppi
                                                </a>
                                            <small class="text-muted">6 小时前</small>
                                        </div>
                                    </div>
                                    <div class="social-body">
                                        <p>
                                            “Flylight 的灯管并不固定，由一套软件控制：每一个灯管都根据与其它灯管的互动进行移动，就像一群真正的鸟群一样。” 好像介绍的描述不对，灯管是固定的，控制的只是点亮和熄灭的时间，模拟成一团亮点移动
                                        </p>
                                    </div>
                                </div>


                            </div>
                        </div>
					</div>
			</div>
        </div>
	</div>

	<div id="small-chat">
       	<!-- <button id="to-top" class="btn btn-primary btn-circle  btn-outline" type="button"><i class="fa fa-arrow-up fa-4"></i></button>
        <div class="margin-top" style=""></div>
        <a href="index">
        	<button class="btn btn-primary btn-circle  btn-outline" type="button"><i class="fa fa-home"></i></button>
        </a> -->
        <a  class="open-small-chat">
                <i class="fa fa-arrow-up"></i>
        </a>
        
        <div class="margin-top" style=""></div>
        <a href="index" class="open-small-chat">
                <i class="fa fa-home"></i>
        </a>
    </div>
    <footer>
         <div class="container">
         
            <div class="copy text-center">
               Copyright 2017 <a href='#'>lexy's blog</a>
            </div>
            
         </div>
    </footer>
	<div id="modal-form" class="modal inmodal fade"  role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-7 b-r">
                            <h3 class="m-t-none m-b">登录</h3>
                            <p>欢迎登录本站(⊙o⊙)</p>
	                        <form role="form"  id="loginForm" >
                                <div class="form-group">
                                    <label>用户名：</label>
                                    <input id="cname" name="name" placeholder="请输入用户名" class="form-control" required="" aria-required="true">
                                </div>
                                <div class="form-group">
                                    <label>密码：</label>
                                    <input id="cpwd" name="pwd"type="password" placeholder="请输入密码" class="form-control" required="" aria-required="true">
                                </div>
                                <div>
                                    <button id="sign-btn" class="btn btn-sm btn-primary pull-right m-t-n-xs" type="button" ><strong>登录</strong>
                                    </button>
                                   <label class="">
                                        <div class="icheckbox_square-green" style="position: relative;"><input type="checkbox" class="i-checks" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;"></ins></div>
                                        	自动登录
                               		</label>
                                </div>
	                        </form>
                        </div>
                        <div class="col-sm-5">
                            <h4>还不是会员？</h4>
                            <p>您可以注册一个账户</p>
                            <p class="text-center">
                                <a href="form_basic.html"><i class="fa fa-sign-in big-icon"></i></a>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 隐藏  -->
    
	<input type="hidden" id="enFlag" value="${enFlag}">    
    
    <!-- 全局js -->
    <script src="<%=pathfile %>/rec/js/jquery-1.8.3.min.js"></script>
    <script src="<%=pathfile %>/rec/js/lens.js"></script>
    <script src="<%=pathfile %>/plugins/bootstrap/js/bootstrap.min.js"></script>
	<script src="<%=pathfile %>/bac/js/async-ajax.js"></script>
	<!-- blueimp gallery -->
    <script src="<%=pathfile %>/plugins/blueimp/jquery.blueimp-gallery.min.js"></script>
	
	    <!-- jQuery Validation plugin javascript-->
    <script src="<%=pathfile %>/plugins/validate/jquery.validate.min.js"></script>
    <script src="<%=pathfile %>/plugins/validate/messages_zh.min.js"></script>

    <script src="<%=pathfile %>/rec/js/form-validate-rec.js"></script>
    
    
 
    
    
    <script type="text/javascript">
	  
    	$(function(){
    		
    		$("#sgin-in-model").click(function(){
    			 $('#modal-form').modal('show');
    		});
     		$("#sign-btn").click(function(){
      			/* $("#loginForm").validate({
   	  			  submitHandler: function(form) { alert("OK");
   	  			    
   	  			    
   	  			  	//reqStr = lens.encode(reqStr);
   	  			    // var result = doPost("signIn", reqStr);
   	  			    //if(result.detail.code='200'){
   	  			    //	//window.location.href="";
   	  			    //}
   	  			    return false;
   	  			  }
   	  			}) */
     			var name = $("#cname").val();
  			    var pwd = $("#cpwd").val();
  			    var reqStr = "{'name':'"+name+"','pwd':'"+pwd+"'}";
  			    console.log($.base64.encode(reqStr));
  			    var enFlagVal = $("#enFlag").val();
  			    if(enFlagVal!=null && enFlagVal!="" && enFlagVal==1){
  			    	reqStr = $.base64.encode(reqStr);
  			    }
  			  	var result = doPost("signIn", reqStr);
	  			if(result.detail.code='200'){
	  				window.location.href="";
	  			}
     		});
    		$("#sgin-out").click(function(){
    			var result = doPost("sginOut", "");
    			alert(result.detail.code);
    			if(result.detail.code='200'){
    				window.location.href="index";
    			}
    		});
    		
    		$("#label-list button").click(function(){
    			
    			var clazzVal = $(this).attr("class");
    			if(clazzVal.indexOf("btn-white")){
	    			$("button[class='btn btn-xs margin-top btn-primary']").attr("class","btn btn-white btn-xs margin-top");
    				$(this).removeClass("btn-white");
        			$(this).addClass("btn-primary");
    			}
    		})
    		
    		$("#to-top").click(function(){
    			toTop();
    		})
    		
    		
    	})
    	
    	
    	function toTop(){
    		$('body').scrollTop(0);
    	}
    	
    
    </script>
</body>
</html>